﻿@using Ebusiness_Authservice.Services.Dtos
@model RegisterRequest

@{
    ViewData["Title"] = "用户注册";
}

<div class="container mt-5">
    <div class="row justify-content-center">
        <div class="col-md-6">
            <div class="card">
                <div class="card-header">
                    <h4>用户注册</h4>
                </div>
                <div class="card-body">
                    <form method="post" action="@Url.Action("Register", "Auth")">
                        <div class="form-group mb-3">
                            <label for="Username">用户名</label>
                            <input type="text" id="Username" name="Username" class="form-control" required />
                            <span asp-validation-for="Username" class="text-danger"></span>
                        </div>

                        <div class="form-group mb-3">
                            <label for="Email">邮箱地址</label>
                            <input type="email" id="Email" name="Email" class="form-control" required />
                            <span asp-validation-for="Email" class="text-danger"></span>
                        </div>

                        <div class="form-group mb-3">
                            <label for="Password">密码</label>
                            <input type="password" id="Password" name="Password" class="form-control" required />
                            <span asp-validation-for="Password" class="text-danger"></span>
                        </div>

                        <div class="form-group mb-3">
                            <label for="ConfirmPassword">确认密码</label>
                            <input type="password" id="ConfirmPassword" name="ConfirmPassword" class="form-control" required />
                            <span id="passwordError" class="text-danger" style="display:none;">两次输入的密码不一致</span>
                        </div>

                        @if (!ViewData.ModelState.IsValid)
                        {
                            <div class="alert alert-danger">
                                @foreach (var error in ViewData.ModelState.Values.SelectMany(v => v.Errors))
                                {
                                    <p>@error.ErrorMessage</p>
                                }
                            </div>
                        }

                        <div class="d-grid">
                            <button type="submit" class="btn btn-primary">注册</button>
                        </div>
                    </form>

                    <div class="mt-3 text-center">
                        <p>已有账户？ <a href="@Url.Action("Login", "Auth")">立即登录</a></p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
    document.addEventListener('DOMContentLoaded', function () {
        const password = document.getElementById('Password');
        const confirmPassword = document.getElementById('ConfirmPassword');
        const passwordError = document.getElementById('passwordError');

        function validatePassword() {
            if (password.value !== confirmPassword.value) {
                passwordError.style.display = 'block';
                return false;
            } else {
                passwordError.style.display = 'none';
                return true;
            }
        }

        confirmPassword.addEventListener('input', validatePassword);

        document.querySelector('form').addEventListener('submit', function (e) {
            if (!validatePassword()) {
                e.preventDefault();
                return false;
            }
        });
    });
</script>